<!DOCTYPE html>
<html>

<head>
    <title>创建校友名片</title>
    <meta name="keywords" content="{$site_info.site_seo_keywords|default=''}" />
    <meta name="description" content="{$site_info.site_seo_description|default=''}">
    <include file="public@head" />
</head>

<body class="bg-light">
    <include file="public@nav" />
    <section class="bg-light py-4">
        <div class="container">
            <div class="text-center text-dark">
                <h5 class="">校友人脉</h5>
                <p class="mb-0">
                    本社区为非官方社区，欢迎大家自由选择发言。
                    <br>建立校友名片录，旨在帮助校友间合作与交流。
                    <br>
                    <br>
                    <span class="badge badge-pill badge-info"><i class="fa fa-id-card-o"></i> 正在创建校友名片…</span>
                </p>
            </div>
        </div>
    </section>
    <section class="container">
        <div class="row">
            <div class="col-2">
                <div class="card border-0 mb-3">
                    <div class="card-body">
                        <div class="text-center">
                            关注微信公众号
                            <br><span class="badge badge-info">新梅陇客栈</span>
                            <img src="/assets/dist/images/qrcode.jpg" class="img-fluid">
                        </div>
                    </div>
                </div>
                <div class="card border-0 mb-3">
                    <div class="card-body">
                        <h6>关于社区</h6>
                        <ul class="list-unstyled">
                            <li><a href="{:cmf_url('portal/Page/index',array('id'=>40))}">联系我们</a></li>
                            <li><a href="{:cmf_url('portal/Page/index',array('id'=>39))}">关于我们</a></li>
                            <li><a href="{:cmf_url('portal/Page/index',array('id'=>39))}">近期活动</a></li>
                        </ul>
                        <h6>快捷联系</h6>
                        <ul class="list-unstyled m-0">
                            <li><a href="tel:(+86) 159-2158-7537"><i class="fa fa-phone"></i> 159-2158-7537</a></li>
                            <li><a href="mailto:supu@vip.qq.com"><i class="fa  fa-envelope-o"></i> supu@vip.qq.com</a></li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="col-7">
                <div class="card border-0">
                    <div class="card-body">
                        <h6>完善我的名片</h6>
                        <form action="{:url('businesscard/Card/addCard')}" method="post" class="js-ajax-form">
                            <div class="form-row">
                                <div class="form-group col-6">
                                    <label for="js-categories-name-input">所属行业 <span class="form-required">*</span></label>
                                    <input class="form-control" type="text" required value="" placeholder="请选择分类" onclick="doSelectCategory();" id="js-categories-name-input" readonly/>
                                    <input class="form-control" type="hidden" value="" name="post[categories]" id="js-categories-id-input" />
                                </div>
                                <div class="form-group col-6">
                                    <label for="name">姓名</label>
                                    <input class="form-control" type="text" name="post[name]" id="name" required value="" placeholder="请输入姓名" />
                                </div>
                            </div>
                            <div class="form-row">
                                <div class="form-group col-6">
                                    <label for="class">班级</label>
                                    <input class="form-control" type="text" name="post[class]" id="class" required value="" placeholder="请输入班级，如2005级化工3班" />
                                </div>
                                <div class="form-group col-6">
                                    <label for="stu_no">学号</label>
                                    <input class="form-control" type="text" name="post[stu_no]" id="stu_no" value="" placeholder="请输入学号" />
                                </div>
                            </div>
                            <div class="form-row">
                                <div class="form-group col-6">
                                    <label for="wechat">微信号</label>
                                    <input class="form-control" type="text" name="post[wechat]" id="wechat" value="" placeholder="请输入微信号" />
                                </div>
                                <div class="form-group col-6">
                                    <label for="mobile_phone">手机</label>
                                    <input class="form-control" type="text" name="post[mobile_phone]" id="mobile_phone" value="" placeholder="请输入手机号" />
                                </div>
                            </div>
                            <div class="form-row">
                                <div class="form-group col-6">
                                    <label for="employer">工作单位</label>
                                    <input class="form-control" type="text" name="post[employer]" id="employer" required value="" placeholder="请输入工作单位" />
                                </div>
                                <div class="form-group col-6">
                                    <label for="position">职位名称</label>
                                    <input class="form-control" type="text" name="post[position]" id="position" value="" placeholder="请输入职位名称" />
                                </div>
                            </div>
                            <div class="form-row">
                                <div class="form-group col-6">
                                    <label for="work_tel">工作电话</label>
                                    <input class="form-control" type="text" name="post[work_tel]" id="work_tel" value="" placeholder="请输入工作电话" />
                                </div>
                                <div class="form-group col-6">
                                    <label for="card_tags">标签 · <small>多个标签用逗号","分隔开</small></label>
                                    <input class="form-control" type="text" name="post[card_tags]" id="card_tags" value="" placeholder="如'化工,生活用品'" />
                                </div>
                            </div>
                            <div class="form-row">
                                <div class="form-group col-12">
                                    <label for="content">详细介绍</label>
                                    <script type="text/plain" id="content" name="post[card_content]"></script>
                                </div>
                            </div>
                            <div class="form-row">
                                <div class="form-group col-12 mb-0">
                                    <button type="submit" class="btn btn-primary js-ajax-submit mr-4">{:lang('ADD')}</button>
                                    <button type="button" class="btn btn-light" onclick="javascript:history.go(-1);">{:lang('BACK')}</button>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
            <div class="col-3">
                <div class="sticky-top">
                    <div class="card border-0 user-card ">
                        <img class="card-img-top" src="/assets/dist/images/card_bg.jpg" alt="Card image cap">
                        <div class="card-body">
                            <div class="text-center">
                                <div style="margin-top:-60px" class="mx-auto">
                                    <empty name="$user.avatar">
                                        <a href="{:url('user/profile/avatar')}">
                                            <img src="/assets/dist/images/headicon_128.png" class="headicon rounded-circle shadow-sm" alt="{$user.user_nickname}">
                                        </a>
                                        <else/>
                                        <a href="{:url('user/profile/center')}">
                                            <img src="{:cmf_get_user_avatar_url($user.avatar)}" class="headicon rounded-circle shadow-sm" alt="{$user.user_nickname}">
                                        </a>
                                    </empty>
                                </div>
                                <h6 class="my-2">{$user.user_nickname}</h6>
                                <p class="card-text">{$user.signature|default="这家伙有点懒，什么都没留下"}</p>
                                <if condition="$user eq false">
                                    <a class="btn btn-info btn-sm" href="{:cmf_url('user/Login/index')}">立即登录</a>
                                </if>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <include file="public@footer" />
    <include file="public@scripts" />
    <script type="text/javascript">
    //编辑器路径定义
    var editorURL = GV.WEB_ROOT;
    </script>
    <script type="text/javascript" src="__STATIC__/js/ueditor/ueditor.config.js"></script>
    <script type="text/javascript" src="__STATIC__/js/ueditor/ueditor.all.min.js"></script>
    <script type="text/javascript" src="__STATIC__/js/distpicker/distpicker.js"></script>
    <script type="text/javascript">
    $(function() {
        editorcontent = new baidu.editor.ui.Editor({
            toolbars: [
                ['bold', 'link', 'insertimage', 'insertvideo', 'indent', 'justifyleft', 'justifycenter', 'fontsize', 'fullscreen']
            ],
            initialFrameHeight: 200,
            retainOnlyLabelPasted: true,
        });
        editorcontent.render('content');
        try {
            editorcontent.sync();
        } catch (err) {}

        $('.btn-cancel-thumbnail').click(function() {
            $('#thumbnail-preview').attr('src', '/assets/dist/images/default-thumbnail.png');
            $('#thumbnail').val('');
        });

    });

    function doSelectCategory() {
        var selectedCategoriesId = $('#js-categories-id-input').val();
        openIframeLayer("{:url('businesscard/Card/select')}?ids=" + selectedCategoriesId, '请选择分类', {
            area: ['400px', '400px'],
            btn: ['确定', '取消'],
            yes: function(index, layero) {
                //do something

                var iframeWin = window[layero.find('iframe')[0]['name']];
                var selectedCategories = iframeWin.confirm();
                if (selectedCategories.selectedCategoriesId.length == 0) {
                    layer.msg('请选择分类');
                    return;
                }
                $('#js-categories-id-input').val(selectedCategories.selectedCategoriesId.join(','));
                $('#js-categories-name-input').val(selectedCategories.selectedCategoriesName.join(' '));
                //console.log(layer.getFrameIndex(index));
                layer.close(index); //如果设定了yes回调，需进行手工关闭
            }
        });
    }

    $(function() {
        var $selector = $('#address-selector');
        var addr = "";
        //初始化时获取地址
        $.each($selector.children(), function(index, e) {
            addr += $(e).val() + '|';
        });
        $('#address').val(addr);

        //select onchange时的地址更新
        $selector.children('select').change(function(event) {
            var newaddr = '';
            $.each($selector.children(), function(index, e) {
                newaddr += $(e).val() + '|';
            });
            $('#address').val(newaddr);
        });

    });
    </script>
</body>

</html>